<template>
	<view class="order-page">
		<van-tabs v-model:active="active">
			<van-tab title="全部" name="a">
				<!-- 商品 -->
				<view style="text-align: center;margin-top: 300rpx;" >
					<van-icon name="balance-list" size="90px" color="#ccc"/>
					<p style="color: #8a8a8a;">暂无订单</p>
				</view>
				<!-- <view class="goods-list">
					<view class="good">
						<p style="margin-left: 20rpx;">方舟建科自营</p>
						<van-card num="2" price="2.00" desc="描述信息" title="商品标题"
							thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
						<view class="button" style="display: flex;
				justify-content: end;margin-right: 20rpx;">
							<van-button round plain type="success" size="small" style="margin-right: 20rpx; ; border: 1px solid #ccc;
					color: #8a8a8a;">删除订单</van-button>
							<van-button plain round type="warning" size="small" style="background-color:  #FFF5F5;"
								url="https://github.com">加入购物车</van-button>
						</view>
					</view>
				</view> -->
			</van-tab>
			<van-tab title="待付款" name="b">
				<!-- 商品 -->
				<!-- <view class="goods-list">
					<view class="good">
						<p style="margin-left: 20rpx;">方舟建科自营</p>
						<van-card num="2" price="2.00" desc="描述信息" title="商品标题"
							thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg" />
						<view class="button" style="display: flex;
			  				justify-content: end;margin-right: 20rpx;">
							<van-button round plain type="success" 
							size="small" 
							style="margin-right: 20rpx; ; border: 1px solid #ccc;
			  					color: #8a8a8a;">删除订单</van-button>
							<van-button plain round type="warning" 
							size="small" style="background-color:  #FFF5F5;"
							url="https://github.com">加入购物车</van-button>
						</view>
					</view>
				</view> -->
				<view style="text-align: center;margin-top: 300rpx;" >
					<van-icon name="balance-list" size="90px" color="#ccc"/>
					<p style="color: #8a8a8a;">暂无待付款</p>
				</view>
			</van-tab>
			<van-tab title="代发货" name="c">
				<view style="text-align: center;margin-top: 300rpx;" >
					<van-icon name="balance-list" size="90px" color="#ccc"/>
					<p style="color: #8a8a8a;">暂无代发货</p>
				</view>
			</van-tab>
			<van-tab title="待收货" name="d">
				<view style="text-align: center;margin-top: 300rpx;" >
					<van-icon name="balance-list" size="90px" color="#ccc"/>
					<p style="color: #8a8a8a;">暂无代收货</p>
				</view>
			</van-tab>
		</van-tabs>

	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';

	import {
		onLoad
	} from '@dcloudio/uni-app';
	const active = ref('a');
	onLoad(({id})=>{
		active.value = id
	})
</script>

<style>
	.order-page {
		height: calc(100vh - 44px);
		background-color: rgb(245 245, 245);
	}

	.goods-list {
		padding: 10rpx 0;
		background-color: #fff;
	}

	.van-card {
		background-color: #fff;
	}
</style>